<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<link rel="stylesheet" href="css/chrome-tabs.css">
</head>
<body>

	<div class="chrome-tabs-shell"></div>
	<div class="chrome-contents-shell"></div>
	
	<script src="js/deps/jquery.min.js"></script>
    <script src="js/deps/jquery-ui.min.js"></script>
    <script src="js/chrome-tabs.js"></script>
    <script>

        var $tabsShell = $('.chrome-tabs-shell');
		var $contentsShell = $(".chrome-contents-shell");

		chromeTabs.init({
			$tabsShell : $tabsShell,
			$contentsShell : $contentsShell,
			maxWidth : 150
		});

		chromeTabs.addNewTab($(".chrome-tabs-shell"), $(".chrome-contents-shell"), {
			tabId : 'ABC',
			url : 'ABC',
			favicon : '',
			title : 'ABC',
			data : {}
		});

		chromeTabs.addNewTab($(".chrome-tabs-shell"), $(".chrome-contents-shell"), {
			tabId : 'BCD',
			url : 'BCD',
			favicon : '',
			title : 'BCD',
			data : {}
		});
		
		/*$tabsShell.bind('chromeTabRender', function(){
            var $currentTab = $tabsShell.find('.chrome-tab-current');
            if ($currentTab.length && window['console'] && console.log) {
                console.log('Current tab index', $currentTab.index(), 'title', $.trim($currentTab.text()), 'data', $currentTab.data('tabData').data);
            }
        });*/
		

    </script>
</body>
</html>